<script setup lang="ts">
import { reactive, ref, watch } from "vue"
import { type FormInstance, ElMessage, type UploadInstance, type FormRules } from "element-plus"
import { usePagination } from "@/hooks/usePagination"
import { Search, Refresh, UploadFilled } from "@element-plus/icons-vue"
import { useUserStore } from "@/store/modules/user"
import { formatDateTime } from "@/utils"
import { shortcuts } from "@/utils/dateSet"
import { getOrderLsApi, updateOrderLsApi, downLoadOrderTable } from "@/api/orderLs/index" // 接口
const userStore = useUserStore()

const { paginationData, handleCurrentChange, handleSizeChange } = usePagination()

console.log(userStore, 888888)
// console.log(userStore.roles[0], 777777)
defineOptions({
  name: "OrderListLs"
})

// #region 搜索
const tableData = ref([])
const defaultTime1: [Date, Date] = [new Date(2000, 1, 1, 0, 0, 0), new Date(2000, 2, 1, 23, 59, 0)]
const searchFormRef = ref<FormInstance | null>(null)
const searchData = reactive({
  time: "", // 时间
  id: "", // 系统ID
  sku: "", // 套餐ID
  orderOutId: "", // 外部ID
  source: "", // 团队名
  handleMobile: "", //  入网号
  state: "", // 状态
  logisticsCompany: "", // 物流公司
  logisticsId: "", //  物流单号
  commissionState: "", //  返佣状态
  wantWant: "", //  旺旺名
  cardName: "", //  入网姓名
  packageName: "", // 套餐
  cardId: "" // 身份号
})
const getTableData = () => {
  getOrderLsApi({
    // start: new Date(searchData.time[0]).getTime() || "",
    // end: new Date(searchData.time[1]).getTime() || "",
    start: searchData.time && searchData.time.length ? new Date(searchData?.time[0]).getTime() : "" || "",
    end: searchData.time && searchData.time.length ? new Date(searchData?.time[1]).getTime() : "" || "",
    sku: searchData.sku, // 套餐ID
    orderOutId: searchData.orderOutId, // 外部ID
    id: searchData.id, // 外部ID
    cardId: searchData.cardId, // 身份号
    handleMobile: searchData.handleMobile, // 入网号
    state: searchData.state, // 状态
    logisticsCompany: searchData.logisticsCompany, // 物流公司
    logisticsId: searchData.logisticsId, // 物流单号
    commissionState: searchData.commissionState, // 返佣状态
    wantWant: searchData.wantWant, // 旺旺名
    cardName: searchData.cardName, // 入网姓名
    packageName: searchData.packageName, // 套餐
    department: userStore.department, // 部门
    team: searchData.source, // 团队
    page: paginationData.currentPage,
    size: paginationData.pageSize
  }).then((res: any) => {
    paginationData.total = res.data.total
    tableData.value = res.data.orderList
    console.log(res, "查询所有数据")
  })
}

/** 监听分页参数的变化 */
watch([() => paginationData.currentPage, () => paginationData.pageSize], getTableData, { immediate: true })
// 查询按键
const handleSearch = () => {
  if (paginationData.currentPage === 1) {
    getTableData()
  }
  paginationData.currentPage = 1
}

// 重置按键
const resetSearch = () => {
  searchFormRef.value?.resetFields()
  if (paginationData.currentPage === 1) {
    getTableData()
  }
  paginationData.currentPage = 1
}
// #endregion

//  #region  导入和导出功能
import { getToken } from "@/utils/cache/cookies"
const uploadRef = ref<UploadInstance>()
const dialogVisible = ref<boolean>(false) // 导入弹窗
const isUploading = ref<boolean>(false)
const titleUpload = ref("")
const uploadheaders = ref<any>({
  token: getToken()
})
// 导入
const handleImport = () => {
  titleUpload.value = ""
  dialogVisible.value = true
}
// 修改
const handleImportX = () => {
  titleUpload.value = "修改"
  dialogVisible.value = true
}
// 上传中禁止上传
const UploadProgress = () => {
  isUploading.value = true
}
// 上传成功
const UploadSuccess = (response: any, file: any, fileList: any) => {
  isUploading.value = false
  uploadRef.value!.clearFiles()
  if (response.code == 200) {
    ElMessage.success("上传成功")
    getTableData()
    dialogVisible.value = false
  }
  console.log(response, "1")
  console.log(file, "2")
  console.log(fileList, "3")
}
// 上传失败
const UploadError = (response: any, file: any, fileList: any) => {
  isUploading.value = false
  ElMessage.error("上传失败")
  uploadRef.value!.clearFiles()
  console.log(response, "2")
  console.log(file, "2")
  console.log(fileList, "2")
}
// 导出
const loading = ref(false)
const downLoad = () => {
  loading.value = true
  console.log("导出")
  downLoadOrderTable({
    start: searchData.time && searchData.time.length ? new Date(searchData?.time[0]).getTime() : "" || "",
    end: searchData.time && searchData.time.length ? new Date(searchData?.time[1]).getTime() : "" || "",
    sku: searchData.sku, // 套餐ID
    orderOutId: searchData.orderOutId, // 外部ID
    id: searchData.id, // 外部ID
    cardId: searchData.cardId, // 身份号
    department: userStore.department, // 部门
    team: searchData.source, // 团队
    state: searchData.state
  }).then((res: any) => {
    const blob = new Blob([res.data], {
      type: "application/xlsx;charset=utf-8"
    })
    const downloadElement = document.createElement("a")
    const href = window.URL.createObjectURL(blob)
    downloadElement.href = href
    downloadElement.download = "历史订单.xlsx"
    document.body.appendChild(downloadElement)
    downloadElement.click()
    window.URL.revokeObjectURL(href)
    loading.value = false
  })
}
const submitFileForm = () => {
  dialogVisible.value = false
  uploadRef.value!.clearFiles()
  console.log("确定")
}
// #endregion

// #region 订单修改和查看
const dialogVisibleA = ref<boolean>(false) // 订单弹窗
const formData = reactive<any>({ data: {} })
const currentUpdateId = ref<undefined | string>(undefined)
const formRef = ref<FormInstance | null>(null)
// 表单验证
const formRules: FormRules = reactive({
  name: [{ required: true, trigger: "change", message: "请填写姓名" }]
})
// 清除规则报错信息
const clearValidate = () => {
  formRef.value?.clearValidate()
}
const resetForm = () => {
  getTableData()
  currentUpdateId.value = undefined
  formData.data = {}
  clearValidate()
}
const handleUpdate = (row: any) => {
  currentUpdateId.value = row.id
  dialogVisibleA.value = true
  formData.data = row
}
const handleSeeMore = (row: any) => {
  console.log(row, "查看详情")
  formData.data = row
  dialogVisibleA.value = true
}
// 修改提交
const uploadFuc = async () => {
  if (currentUpdateId.value !== undefined) {
    await updateOrderLsApi(formData.data).then(() => {
      ElMessage.success("修改成功")
      dialogVisibleA.value = false
      getTableData()
    })
  } else {
    dialogVisibleA.value = false
  }
}
const handleCreate = () => {
  formRef.value?.validate((valid: boolean) => {
    if (valid) {
      uploadFuc()
    } else {
      return false
    }
  })
}
// #endregion

/**加密 */
const toHideString = (val: any, len: any) => {
  if (val.length == 2) {
    return `${val.substring(0, len)}***${val.substring(val.length)}`
  } else {
    return `${val.substring(0, len)}***${val.substring(val.length - len)}`
  }
}
// 订单来源
import { getqueryTeamName } from "@/api/team"
const queryTeamName = ref()
const TeamName = () => {
  getqueryTeamName({}).then((res: any) => {
    queryTeamName.value = res.data
    console.log(queryTeamName.value, "数据")
  })
}
TeamName()
</script>

<template>
  <div class="app-container">
    <!-- 搜索 -->
    <el-card class="search-wrapper">
      <el-form ref="searchFormRef" :inline="true" :model="searchData">
        <el-form-item prop="time" label="订单日期">
          <el-date-picker
            v-model="searchData.time"
            type="datetimerange"
            range-separator="到"
            start-placeholder="开始时间"
            end-placeholder="结束时间"
            :shortcuts="shortcuts"
            :default-time="defaultTime1"
          />
        </el-form-item>
        <el-form-item prop="id" label="订单ID">
          <el-input v-model.trim="searchData.id" placeholder="请输入" />
        </el-form-item>
        <el-form-item prop="orderOutId" label="外部ID">
          <el-input v-model.trim="searchData.orderOutId" placeholder="请输入" />
        </el-form-item>
        <el-form-item prop="source" label="订单来源">
          <!-- <el-input v-model.trim="searchData.source" placeholder="请输入" /> -->
          <el-select v-model="searchData.source" clearable filterable placeholder="请选择订单来源" style="width: 240px">
            <el-option v-for="item in queryTeamName" :key="item.id" :label="item.name" :value="item.name" />
          </el-select>
        </el-form-item>
        <el-form-item prop="packageName" label="套餐">
          <el-input v-model.trim="searchData.packageName" placeholder="请输入" />
        </el-form-item>
        <el-form-item prop="handleMobile" label="入网号">
          <el-input v-model.trim="searchData.handleMobile" placeholder="请输入" />
        </el-form-item>
        <el-form-item prop="cardName" label="入网姓名">
          <el-input v-model.trim="searchData.cardName" placeholder="请输入" />
        </el-form-item>
        <el-form-item prop="cardId" label="身份证号">
          <el-input v-model.trim="searchData.cardId" placeholder="请输入" />
        </el-form-item>
        <el-form-item prop="state" label="订单状态">
          <el-input v-model.trim="searchData.state" placeholder="请输入" />
        </el-form-item>
        <el-form-item prop="logisticsCompany" label="物流公司">
          <el-input v-model.trim="searchData.logisticsCompany" placeholder="请输入" />
        </el-form-item>
        <el-form-item prop="logisticsId" label="物流单号">
          <el-input v-model.trim="searchData.logisticsId" placeholder="请输入" />
        </el-form-item>
        <el-form-item prop="commissionState" label="返佣状态">
          <el-input v-model.trim="searchData.commissionState" placeholder="请输入" />
        </el-form-item>
        <el-form-item prop="wantWant" label="旺旺名">
          <el-input v-model.trim="searchData.wantWant" placeholder="请输入" />
        </el-form-item>
        <el-form-item>
          <el-button type="primary" :icon="Search" @click="handleSearch">查询</el-button>
          <el-button :icon="Refresh" @click="resetSearch">重置</el-button>
        </el-form-item>
      </el-form>
      <el-row :gutter="10" class="mb8">
        <el-col :span="1.5">
          <el-button
            v-if="userStore.teamName == '' && userStore.department == ''"
            type="info"
            plain
            icon="Upload"
            @click="handleImport"
            >导入</el-button
          >
        </el-col>
        <el-col :span="1.5">
          <el-button type="warning" plain icon="Download" @click="downLoad">导出</el-button>
        </el-col>
        <el-col :span="1.5">
          <el-button
            v-if="userStore.teamName == '' && userStore.department == ''"
            type="info"
            plain
            icon="Upload"
            @click="handleImportX"
            >批量修改</el-button
          >
        </el-col>
      </el-row>
    </el-card>
    <!-- 表格 -->
    <el-card v-loading="loading" element-loading-text="下载中...">
      <div class="table-wrapper">
        <el-table :data="tableData" ref="tableRef">
          <!-- <el-table-column type="selection" width="50" align="center" /> -->
          <el-table-column prop="id" label="ID" align="center" />
          <el-table-column prop="orderId" label="订单外部ID" align="center" />
          <el-table-column prop="create" label="创建时间" align="center">
            <template #default="scope">
              {{ formatDateTime(scope.row.create) }}
            </template>
          </el-table-column>
          <el-table-column prop="update" label="反馈时间" align="center">
            <template #default="scope">
              {{ formatDateTime(scope.row.update) }}
            </template>
          </el-table-column>
          <el-table-column prop="source" label="订单来源" align="center" />
          <!-- <el-table-column prop="wantWant" label="旺旺名" align="center" /> -->
          <el-table-column prop="packageName" label="套餐名称" align="center" width="220" />
          <!-- <el-table-column prop="iccid" label="ICCID" align="center" /> -->
          <el-table-column prop="handleMobile" label="入网号" align="center" />
          <el-table-column prop="cardName" label="入网姓名" align="center">
            <template #default="scope">
              {{ toHideString(scope.row.cardName, 1) }}
            </template>
          </el-table-column>
          <el-table-column prop="cardId" label="身份证号" align="center">
            <template #default="scope">
              {{ toHideString(scope.row.cardId, 6) }}
            </template>
          </el-table-column>
          <el-table-column prop="note" label="订单备注" align="center" />
          <!-- <el-table-column prop="consignee" label="收货人" align="center" /> -->
          <!-- <el-table-column prop="takeMobile" label="收货人电话" align="center" /> -->
          <el-table-column prop="takeAddress" label="收货地址" align="center">
            <template #default="scope">
              {{ toHideString(scope.row.takeAddress, 6) }}
            </template>
          </el-table-column>
          <el-table-column prop="state" label="订单状态" align="center" />
          <el-table-column prop="result" label="状态反馈" align="center" />
          <el-table-column prop="logisticsCompany" label="物流公司" align="center" />
          <el-table-column prop="logisticsId" label="物流单号" align="center" />
          <el-table-column prop="logisticsDate" label="物流时间" align="center">
            <template #default="scope">
              {{ formatDateTime(scope.row.logisticsDate) }}
            </template>
          </el-table-column>
          <el-table-column prop="commissionState" label="返佣状态" align="center">
            <template #default="scope">
              <el-text class="mx-1" type="success" v-if="scope.row.commissionState == '已返佣'">{{
                scope.row.commissionState
              }}</el-text>
              <el-text class="mx-1" type="danger" v-else>{{ scope.row.commissionState }}</el-text>
            </template>
          </el-table-column>
          <el-table-column
            v-if="userStore.roles[0] == '超级管理员' || userStore.roles[0] == '管理账户'"
            prop="superiorName"
            label="上级名"
            align="center"
          />
          <el-table-column fixed="right" label="操作" width="100" align="center">
            <template #default="scope">
              <el-button
                v-if="userStore.teamName == '' && userStore.department == ''"
                type="primary"
                text
                bg
                size="small"
                @click="handleUpdate(scope.row)"
                >修改</el-button
              ><br /><br />
              <el-button type="primary" text bg size="small" @click="handleSeeMore(scope.row)"> 查看详情</el-button>
            </template>
          </el-table-column>
        </el-table>
      </div>

      <div class="pager-wrapper">
        <el-pagination
          background
          :layout="paginationData.layout"
          :page-sizes="paginationData.pageSizes"
          :total="paginationData.total"
          :page-size="paginationData.pageSize"
          :currentPage="paginationData.currentPage"
          @size-change="handleSizeChange"
          @current-change="handleCurrentChange"
        />
      </div>
    </el-card>

    <!-- 用户导入对话框 -->
    <el-dialog
      :title="titleUpload == '' ? '导入数据' : '批量修改'"
      v-model="dialogVisible"
      width="400px"
      append-to-body
    >
      <el-upload
        ref="uploadRef"
        class="upload-demo"
        drag
        :limit="1"
        accept=".xlsx, .xls"
        :action="titleUpload == '' ? 'api/orderHistory/batchAdd' : 'api/orderHistory/batchUpdate'"
        multiple
        :headers="uploadheaders"
        :disabled="isUploading"
        :on-progress="UploadProgress"
        :on-success="UploadSuccess"
        :on-error="UploadError"
      >
        <el-icon class="el-icon--upload"><upload-filled /></el-icon>
        <div class="el-upload__text">将文件拖到此处，或<em>点击上传</em></div>
        <template #tip>
          <div class="el-upload__tip text-center">
            <span>仅允许导入xls、xlsx格式文件。</span>
            <el-link
              type="primary"
              :underline="false"
              style="font-size: 12px; vertical-align: baseline"
              href="api/orderHistory/down/downTemplate"
              >下载模板</el-link
            >
          </div>
        </template>
      </el-upload>
      <template #footer>
        <div class="dialog-footer">
          <el-button type="primary" @click="submitFileForm">确 定</el-button>
          <el-button @click="dialogVisible = false">取 消</el-button>
        </div>
      </template>
    </el-dialog>
    <!-- 查看/修改 -->
    <el-dialog
      v-model="dialogVisibleA"
      :title="currentUpdateId === undefined ? '查看订单' : '修改订单'"
      @close="resetForm"
      width="80%"
    >
      <el-form ref="formRef" :model="formData.data" :rules="formRules" label-width="100px" label-position="left">
        <el-row :gutter="12" v-if="currentUpdateId == undefined">
          <el-col :span="6">
            <div style="text-align: center; margin-bottom: 10px">
              <el-text type="primary" size="large">订单信息</el-text>
            </div>
            <el-card shadow="always" :body-style="{ height: '600px' }">
              <el-form-item label="ID" prop="id">
                <el-input v-model="formData.data.id" placeholder="请输入" disabled />
              </el-form-item>

              <el-form-item
                v-if="userStore.roles[0] == '超级管理员' || userStore.roles[0] == '管理账户'"
                label="上级编号"
                prop="superiorId"
              >
                <el-input
                  v-model="formData.data.superiorId"
                  placeholder="请输入"
                  :disabled="currentUpdateId === undefined"
                />
              </el-form-item>
              <el-form-item
                v-if="userStore.roles[0] == '超级管理员' || userStore.roles[0] == '管理账户'"
                label="上级名"
                prop="superiorName"
              >
                <el-input
                  v-model="formData.data.superiorName"
                  placeholder="请输入"
                  :disabled="currentUpdateId === undefined"
                />
              </el-form-item>
              <el-form-item label="订单外部ID" prop="orderId">
                <el-input
                  v-model="formData.data.orderId"
                  placeholder="请输入"
                  :disabled="currentUpdateId === undefined"
                />
              </el-form-item>
              <el-form-item label="订单来源" prop="source">
                <el-input
                  v-model="formData.data.source"
                  placeholder="请输入"
                  :disabled="currentUpdateId === undefined"
                />
              </el-form-item>
              <el-form-item label="旺旺名" prop="wantWant">
                <el-input
                  v-model="formData.data.wantWant"
                  placeholder="请输入"
                  :disabled="currentUpdateId === undefined"
                />
              </el-form-item>
              <el-form-item label="店铺ID" prop="shop_id">
                <el-input
                  v-model="formData.data.shop_id"
                  placeholder="请输入"
                  :disabled="currentUpdateId === undefined"
                />
              </el-form-item>
              <el-form-item label="订单备注" prop="note">
                <el-input v-model="formData.data.note" placeholder="请输入" :disabled="currentUpdateId === undefined" />
              </el-form-item>
            </el-card>
          </el-col>
          <el-col :span="6">
            <div style="text-align: center; margin-bottom: 10px">
              <el-text type="primary" size="large">下单信息</el-text>
            </div>
            <el-card shadow="always" :body-style="{ height: '600px' }">
              <el-form-item label="入网号" prop="handleMobile">
                <el-input
                  v-model="formData.data.handleMobile"
                  placeholder="请输入"
                  :disabled="currentUpdateId === undefined"
                />
              </el-form-item>
              <el-form-item label="ICCID" prop="iccid">
                <el-input
                  v-model="formData.data.iccid"
                  placeholder="请输入"
                  :disabled="currentUpdateId === undefined"
                />
              </el-form-item>
              <el-form-item label="套餐名称" prop="packageName">
                <el-input
                  v-model="formData.data.packageName"
                  placeholder="请输入"
                  :disabled="currentUpdateId === undefined"
                />
              </el-form-item>
              <el-form-item label="收货人" prop="consignee">
                <el-input
                  v-model="formData.data.consignee"
                  placeholder="请输入"
                  :disabled="currentUpdateId === undefined"
                />
              </el-form-item>
              <el-form-item label="收货人电话" prop="takeMobile">
                <el-input
                  v-model="formData.data.takeMobile"
                  placeholder="请输入"
                  :disabled="currentUpdateId === undefined"
                />
              </el-form-item>
              <el-form-item label="收货地址" prop="takeAddress">
                <el-input
                  v-model="formData.data.takeAddress"
                  placeholder="请输入"
                  :disabled="currentUpdateId === undefined"
                />
              </el-form-item>
              <el-form-item label="入网姓名" prop="cardName">
                <el-input
                  v-model="formData.data.cardName"
                  placeholder="请输入"
                  :disabled="currentUpdateId === undefined"
                />
              </el-form-item>
              <el-form-item label="身份证号" prop="cardId">
                <el-input
                  v-model="formData.data.cardId"
                  placeholder="请输入"
                  :disabled="currentUpdateId === undefined"
                />
              </el-form-item>
            </el-card>
          </el-col>
          <el-col :span="6">
            <div style="text-align: center; margin-bottom: 10px">
              <el-text type="primary" size="large">物流信息</el-text>
            </div>
            <el-card shadow="always" :body-style="{ height: '600px' }">
              <!-- 换时间 -->
              <el-form-item prop="logisticsDate" label="物流时间">
                <el-date-picker
                  v-model="formData.data.logisticsDate"
                  type="datetime"
                  range-separator="到"
                  start-placeholder="开始时间"
                  end-placeholder="结束时间"
                  :default-time="defaultTime1"
                  :disabled="currentUpdateId === undefined"
                />
              </el-form-item>
              <el-form-item label="物流公司" prop="logisticsCompany">
                <el-input
                  v-model="formData.data.logisticsCompany"
                  placeholder="请输入"
                  :disabled="currentUpdateId === undefined"
                />
              </el-form-item>
              <el-form-item label="物流单号" prop="logisticsId">
                <el-input
                  v-model="formData.data.logisticsId"
                  placeholder="请输入"
                  :disabled="currentUpdateId === undefined"
                />
              </el-form-item>
            </el-card>
          </el-col>
          <el-col :span="6">
            <div style="text-align: center; margin-bottom: 10px">
              <el-text type="primary" size="large">跟进信息</el-text>
            </div>
            <el-card shadow="always" :body-style="{ height: '600px' }">
              <el-form-item label="订单状态" prop="state">
                <el-input
                  v-model="formData.data.state"
                  placeholder="请输入"
                  :disabled="currentUpdateId === undefined"
                />
              </el-form-item>
              <el-form-item label="状态反馈" prop="result">
                <el-input
                  v-model="formData.data.result"
                  placeholder="请输入"
                  :disabled="currentUpdateId === undefined"
                />
              </el-form-item>
              <el-form-item label="套餐充值活动" prop="salesman">
                <el-input
                  v-model="formData.data.salesman"
                  placeholder="请输入"
                  :disabled="currentUpdateId === undefined"
                />
              </el-form-item>
              <el-form-item prop="create" label="创建时间">
                <el-date-picker
                  v-model="formData.data.create"
                  type="datetime"
                  range-separator="到"
                  start-placeholder="开始时间"
                  end-placeholder="结束时间"
                  :default-time="defaultTime1"
                  :disabled="currentUpdateId === undefined"
                />
              </el-form-item>
              <el-form-item prop="update" label="反馈时间">
                <el-date-picker
                  v-model="formData.data.update"
                  type="datetime"
                  range-separator="到"
                  start-placeholder="开始时间"
                  end-placeholder="结束时间"
                  :default-time="defaultTime1"
                  :disabled="currentUpdateId === undefined"
                />
              </el-form-item>

              <el-form-item prop="chargingDate" label="充值时间">
                <el-date-picker
                  v-model="formData.data.chargingDate"
                  type="datetime"
                  range-separator="到"
                  start-placeholder="开始时间"
                  end-placeholder="结束时间"
                  :default-time="defaultTime1"
                  :disabled="currentUpdateId === undefined"
                />
              </el-form-item>
              <el-form-item label="返佣状态" prop="commissionState">
                <el-input
                  v-model="formData.data.commissionState"
                  placeholder="请输入"
                  :disabled="currentUpdateId === undefined"
                />
              </el-form-item>
            </el-card>
          </el-col>
        </el-row>
        <div v-if="currentUpdateId !== undefined">
          <el-form-item label="ID" prop="id">
            <el-input v-model="formData.data.id" placeholder="请输入" disabled />
          </el-form-item>
          <el-form-item
            v-if="userStore.roles[0] == '超级管理员' || userStore.roles[0] == '管理账户'"
            label="上级编号"
            prop="superiorId"
          >
            <el-input
              v-model="formData.data.superiorId"
              placeholder="请输入"
              :disabled="currentUpdateId === undefined"
            />
          </el-form-item>
          <el-form-item
            v-if="userStore.roles[0] == '超级管理员' || userStore.roles[0] == '管理账户'"
            label="上级名"
            prop="superiorName"
          >
            <el-input
              v-model="formData.data.superiorName"
              placeholder="请输入"
              :disabled="currentUpdateId === undefined"
            />
          </el-form-item>
          <el-form-item label="订单外部ID" prop="orderId">
            <el-input v-model="formData.data.orderId" placeholder="请输入" :disabled="currentUpdateId === undefined" />
          </el-form-item>
          <el-form-item label="订单来源" prop="source">
            <el-input v-model="formData.data.source" placeholder="请输入" :disabled="currentUpdateId === undefined" />
          </el-form-item>
          <el-form-item label="旺旺名" prop="wantWant">
            <el-input v-model="formData.data.wantWant" placeholder="请输入" :disabled="currentUpdateId === undefined" />
          </el-form-item>
          <el-form-item label="店铺ID" prop="shop_id">
            <el-input v-model="formData.data.shop_id" placeholder="请输入" :disabled="currentUpdateId === undefined" />
          </el-form-item>
          <el-form-item label="订单备注" prop="note">
            <el-input v-model="formData.data.note" placeholder="请输入" :disabled="currentUpdateId === undefined" />
          </el-form-item>

          <el-form-item label="入网号" prop="handleMobile">
            <el-input
              v-model="formData.data.handleMobile"
              placeholder="请输入"
              :disabled="currentUpdateId === undefined"
            />
          </el-form-item>
          <el-form-item label="ICCID" prop="iccid">
            <el-input v-model="formData.data.iccid" placeholder="请输入" :disabled="currentUpdateId === undefined" />
          </el-form-item>
          <el-form-item label="套餐名称" prop="packageName">
            <el-input
              v-model="formData.data.packageName"
              placeholder="请输入"
              :disabled="currentUpdateId === undefined"
            />
          </el-form-item>
          <el-form-item label="收货人" prop="consignee">
            <el-input
              v-model="formData.data.consignee"
              placeholder="请输入"
              :disabled="currentUpdateId === undefined"
            />
          </el-form-item>
          <el-form-item label="收货人电话" prop="takeMobile">
            <el-input
              v-model="formData.data.takeMobile"
              placeholder="请输入"
              :disabled="currentUpdateId === undefined"
            />
          </el-form-item>
          <el-form-item label="收货地址" prop="takeAddress">
            <el-input
              v-model="formData.data.takeAddress"
              placeholder="请输入"
              :disabled="currentUpdateId === undefined"
            />
          </el-form-item>
          <el-form-item label="入网姓名" prop="cardName">
            <el-input v-model="formData.data.cardName" placeholder="请输入" :disabled="currentUpdateId === undefined" />
          </el-form-item>
          <el-form-item label="身份证号" prop="cardId">
            <el-input v-model="formData.data.cardId" placeholder="请输入" :disabled="currentUpdateId === undefined" />
          </el-form-item>

          <!-- 换时间 -->
          <el-form-item prop="logisticsDate" label="物流时间">
            <el-date-picker
              v-model="formData.data.logisticsDate"
              type="datetime"
              range-separator="到"
              start-placeholder="开始时间"
              end-placeholder="结束时间"
              :default-time="defaultTime1"
              :disabled="currentUpdateId === undefined"
            />
          </el-form-item>
          <el-form-item label="物流公司" prop="logisticsCompany">
            <el-input
              v-model="formData.data.logisticsCompany"
              placeholder="请输入"
              :disabled="currentUpdateId === undefined"
            />
          </el-form-item>
          <el-form-item label="物流单号" prop="logisticsId">
            <el-input
              v-model="formData.data.logisticsId"
              placeholder="请输入"
              :disabled="currentUpdateId === undefined"
            />
          </el-form-item>

          <el-form-item label="订单状态" prop="state">
            <el-input v-model="formData.data.state" placeholder="请输入" :disabled="currentUpdateId === undefined" />
          </el-form-item>
          <el-form-item label="状态反馈" prop="result">
            <el-input v-model="formData.data.result" placeholder="请输入" :disabled="currentUpdateId === undefined" />
          </el-form-item>
          <el-form-item label="套餐充值活动" prop="salesman">
            <el-input v-model="formData.data.salesman" placeholder="请输入" :disabled="currentUpdateId === undefined" />
          </el-form-item>
          <el-form-item prop="create" label="创建时间">
            <el-date-picker
              v-model="formData.data.create"
              type="datetime"
              range-separator="到"
              start-placeholder="开始时间"
              end-placeholder="结束时间"
              :default-time="defaultTime1"
              :disabled="currentUpdateId === undefined"
            />
          </el-form-item>
          <el-form-item prop="update" label="反馈时间">
            <el-date-picker
              v-model="formData.data.update"
              type="datetime"
              range-separator="到"
              start-placeholder="开始时间"
              end-placeholder="结束时间"
              :default-time="defaultTime1"
              :disabled="currentUpdateId === undefined"
            />
          </el-form-item>

          <el-form-item prop="chargingDate" label="充值时间">
            <el-date-picker
              v-model="formData.data.chargingDate"
              type="datetime"
              range-separator="到"
              start-placeholder="开始时间"
              end-placeholder="结束时间"
              :default-time="defaultTime1"
              :disabled="currentUpdateId === undefined"
            />
          </el-form-item>
          <el-form-item label="返佣状态" prop="commissionState">
            <el-input
              v-model="formData.data.commissionState"
              placeholder="请输入"
              :disabled="currentUpdateId === undefined"
            />
          </el-form-item>
        </div>
      </el-form>

      <template #footer>
        <el-button @click="dialogVisibleA = false">取消</el-button>
        <el-button type="primary" @click="handleCreate">确认</el-button>
      </template>
    </el-dialog>
  </div>
</template>
<style lang="scss" scoped>
.search-wrapper {
  margin-bottom: 20px;
  :deep(.el-card__body) {
    padding-bottom: 2px;
  }
}

.table-wrapper {
  margin-bottom: 20px;
}
.pager-wrapper {
  display: flex;
  justify-content: flex-end;
}
</style>
